<template>
  <el-dialog
    :title="!dataForm.id ? '日志详情' : '日志详情'"
    :close-on-click-modal="false"
    :visible.sync="visible"
    width="80%"
  >
    <el-form :model="dataForm" ref="dataForm" label-width="80px">
       <el-row>
        <el-col :span="12">
          <el-form-item label="主题:" prop="realName" class="el_from_item_left">
            {{ dataForm.theme }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="名称:" prop="realName">
            {{ dataForm.name }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="收件人:" prop="name" class="el_from_item_left">
            {{ dataForm.addressee }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="抄送人:" prop="email">
            {{ dataForm.ccList }}
          </el-form-item>
        </el-col>
      </el-row>
     
      <el-row>
        <el-col :span="12">
          <el-form-item label="发送参数:" prop="phone" class="el_from_item_left">
             <span v-text="dataForm.paramJson.replace(/<.+?>/g, '').replace(/&nbsp;/ig, '').replace(/\s/ig, '')"></span>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="状态:" prop="birthday">
            {{ dataForm.status == 1 ? "已发送" : "发送失败" }}
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
         
          <el-form-item label="内容:" prop="idNo">
             <div class="content">
            <p v-html="dataForm.content" style="margin:5px"></p>
             </div>
          </el-form-item>
         
        </el-col>
      </el-row>
    </el-form>
    <span slot="footer" class="dialog-footer" >
      <el-button @click="visible = false">关闭</el-button>
    </span>
  </el-dialog>
</template>

<script>
export default {
  name: "emsgemiallog-detils",
  data() {
    return {
      visible: false,
      dataForm: {
        id: 0,
        addressee: "",
        ccList: "",
        paramJson: "",
        name: "",
        theme: "",
        content: "",
        status: "",
      },
    };
  },
  created() {},
  methods: {
    init(id) {
      this.visible = true;
      this.$nextTick(() => {
        this.$refs["dataForm"].resetFields();
        if (id) {
          this.$http({
            url: this.$http.adornUrl(`/emsgemiallog/info/${id}`),
            method: "get",
            params: this.$http.adornParams(),
          }).then(({ data }) => {
            if (data && data.code === 0) {
              this.dataForm = data.emsgEmialLog;
            }
          });
        }
      });
    },
  },
};
</script>
<style scoped>
.el-col {
  word-break: break-all;
}
.content{
  border-radius: 5px;
  height: 400px;
  overflow-y: auto;
  -ms-overflow-style:none;
  overflow: -moz-scrollbars-none;overflow-x:hidden; 
  border: 1px solid skyblue;
  background-color: whitesmoke;
}.el_from_item_left{
  margin-left: 100px;
}
</style>
